<script setup lang="ts">
const props = defineProps < {
  item: any;
  checkable?: boolean;
} >();

const check = ref(false);
function go() {
  uni.navigateTo({
    url: '/pages/service-detail/index',
  });
}
</script>

<template>
  <view class="flex items-center">
    <view v-if="props.checkable">
      <nut-checkbox v-model="check" label="1" />
    </view>
    <view class="check-item" @click="go">
      <view class="bg-white bd-8 p4 mb3 flex items-center">
        <view class="mr2">
          <nut-avatar shape="square" size="large">
            <image src="https://img12.360buyimg.com/imagetools/jfs/t1/196430/38/8105/14329/60c806a4Ed506298a/e6de9fb7b8490f38.png" />
          </nut-avatar>
        </view>
        <view class="flex-1">
          <view class="font-600 font-size-5">
            名称 <nut-icon name="home" />
          </view>
          <view class="my1">
            房间：101 - 2床
          </view>
          <view class="color-#555 mb2">
            服务次数：1 / 10
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<style lang="scss">
:root page {
  --nut-checkbox-button-font-color-active: blue
}

.check-item {
  flex: 1
}
</style>

<route lang="json">
</route>
